<template>
  <div class="building">
    <div class="hd">
        <h2 class="title">
            楼栋管理
        </h2>
        <el-input class="ipt"
        clearable
        @clear="search"
        prefix-icon="el-icon-search"
         placeholder="请输入小区名" v-model="buidingName" 
         @keyup.enter.native="search"></el-input>
        <el-button type="primary" size="small" @click="search">查询</el-button>
        <el-button type="success" size="small" @click="addShow(true, '新建小区')">新建小区</el-button>
    </div>
    <div class="bd">
      <Tree
      :list="buildinglist"
      :searchText="seachText"
      :btnAdd="$utils.getPower('楼栋', '添加')"
      :btnUpdate="$utils.getPower('楼栋', '修改')"
      :btnDelete="$utils.getPower('楼栋', '删除')"
      @addRow="addShow"
      @delRow="deleteBuilding"
       />
    </div>
    <BuildingDialog
    :show="showDialog"
    @close="addShow"
     />
  </div>
</template>
<script>
import http from "./../../api/nodec";
import Tree from "../common/tree";
import BuildingDialog from "./dialog";

export default {
  components: {
    Tree,
    BuildingDialog
  },
  data () {
      return {
          buidingName: '',
          seachText: '',
          showDialog: false,
          buildinglist: [],
          addForm: {
              id: 0,
              name: '',
              pid: 0
          }
      }
  },
  created () {
    //   console.log(this.$utils.getPower('楼栋', '添加'));
      
      this.getBuildingList()
  },
  methods: {
      async getBuildingList () {
          const { data } = await http.buildinglist()
          this.buildinglist = data.list
      },
      search () {
          this.seachText = this.buidingName
      },
      addShow (show, title, data, flag) {
          console.log(show, title, data, flag)


          this.showDialog = show
          this.$store.commit('building/SET_TITLE', title)
          if (show) {
              // 添加小区
              if (!data) {
                  this.$store.commit('building/SET_ADDFORM', this.addForm)
              } else {
                  // 添加子类
                  if (flag === 0) {
                      this.$store.commit('building/SET_ADDFORM', {
                          id: 0,
                          name: '',
                          pid: data.id
                      })


                  } else {
                      // 修改
                      this.$store.commit('building/SET_ADDFORM', {
                          id: data.id,
                          name: data.name,
                          pid: data.pid
                      })


                  }
              }
          } else {
              flag && this.getBuildingList()
              this.$store.commit('building/SET_ADDFORM', this.addForm)
          }


      },
      deleteBuilding (data) {
          const { id } = data
          this.$utils.messageTip('确定要删除吗？','提示').then(async () => {
            const { errCode } = await http.deleteBuilding({id})
            if (errCode === 10000) {
                this.$message.success('删除成功')
                this.getBuildingList()
            } else {
                this.$message.error('删除失败')
            }


          }).catch(() => {
                this.$message.info('取消删除')


          })


      }
  }
};
</script>


<style lang="less" scoped>
.hd {
    display: flex;
    align-items: center;
     padding: 10px 0 20px;
     border-bottom: 1px solid #eee;
    .title {
        font-size: 16px;
        color: #427ff4;
    }
    .ipt {
        width: 200px;
        margin: 0 10px;


    }
}
</style>